<template>
    <div>
        <div class="top">
    <a class="left-icon" href="javascript:history.back()"></a>
    <span class="center-text">{{title}}</span>
    <i class="right-icon" v-show="false"></i>
</div>
<div class="discount-list-con">
    <ul class="top-nav">
        <li class="list-li "  :class="ind==1?'active':''" @click="act(1)">智能排序</li>
        <li class="list-li" :class="ind==2?'active':''" @click="act(2)">最新推荐</li>
        <li class="list-li" :class="ind==3?'active':''" @click="act(3)">销量排名</li>
        <li class="list-li" :class="ind==4?'active':''" @click="act(4)">距离最近</li>
    </ul>
    <div class="tab-content"  v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
        <div class="tab-content-in" >
            <div class="same-box" v-for="(item,i) in list" :key="i">
                <div class="top-content">
                    <div class="left-info">
                        <h4 class="title">{{item.company.companyName}}</h4>
                        <div class="img-all">
                            <router-link :to="{name:'Commodity_details',query:{id:itemc.goodsId}}"  v-for="itemc in item.goods" :key="itemc.goodsId">
                                <img :src="itemc.goodsThum" alt="">
                            </router-link>
                        </div>
                    </div>

                    <div class="right-info" v-if="item.coupon.length>0">
                        <div class="price1">
                            <span>￥</span>{{item.coupon.score1  |amountMin100}}
                        </div>
                        <div class="price2">满{{item.coupon.reach1 |amountMin100}}可用</div>
                        <a href="#" class="lq">立即领券</a>
                    </div>
                    <div class="right-info" v-else>
                       <p style="margin-top:50px;"> 暂无优惠券</p> 
                    </div>
                </div>
                <div class="bottom-content">
                    <i class="add-icon"></i>
                    <span class="add-text">{{item.company.companyName}} </span>|
                    <span class="jl-text" > {{item.company.address}}</span>
                </div>
            </div>
        </div>
        <loadingtmp :busy="busy" :loadall="loadall"></loadingtmp>
    </div> 
</div>
<div class="layer-content">
    <div class="layer-content-in">
        <i class="close-icon">

        </i>
        <div class="card-num">
            10
        </div>
        <p class="success">已领取成功，存至卡券</p>
        <a href="../shops/commodity.html" class="use-btn" data-ajax="false">去使用</a>
    </div>
</div>
<!-- <div class="backTo" onclick="javascript:history.back(-1);">返回</div> -->
    </div>
</template>
<style scoped>
  @import "../../../assets/personal/css/discount_list.css";
  .tab-content{
      position: absolute;
      left: 0;
      top: 5rem;
      bottom: 0;
      width: 100%;
      overflow: scroll;
  }
</style>
<script>
///api/wap/type/goods3/coupon?companyTypeId=1&page=1&rows=12 //小行类
import loadingtmp from '@/components/load/loading'
export default {
    data(){
        return{
           title:'美食美客',
           list:[],
           id:1,
           issub:false,
           subid:0,
           ind:1,
            page:1,
            pageSize:10,
            busy:false,
            loadall: false
        }
    },
    methods:{
       act:function(id){
        this.ind=id
       },
        getcateinfo(flag){
            this.$http.get(this.APIURL_PREFIX+"/api/wap/"+(this.id?"industry":"type")+"/goods3/coupon?"+(this.id?"companyIndustryId":"companyTypeId")+"="+(this.id||this.subid)+"&page="+this.page+"&rows="+this.pageSize).then((response) => {//+"&page="+this.page+"&rows="+this.pageSize
                 if(flag){
                    this.list = this.list.concat(response.data.data);
                }else{
                    this.list = response.data.data;
                }
                if( 0 == response.data.data.length || response.data.length<this.pageSize ){
                    this.busy = true;
                    this.loadall = true;
                }
                else{
                    this.busy = false;
                    this.page++
                }
                console.log(response.data)
                console.log(response.data.data[0]["company"]["companyId"])
            }).catch(function(err){
                console.log(err)
            });
        },
    loadMore(){
      this.busy = true;
      setTimeout(() => {
        this.getcateinfo(this.page>1);
       }, 500);
    }
},
     mounted(){
         this.id = this.$route.params.id;
         this.subid = this.$route.params.subid;
         if(this.subid){ this.issub = true}
        this.$http.get(this.APIURL_PREFIX+"/api/wap/"+(this.id?"industry":"type")+"/onlyOne/"+(this.id||this.subid)).then((response) => {
            console.log(response.data)
            this.title= response.data.data.name;
        }).catch(function(err){
            console.log(err)
        })    
     },
    components: {
        loadingtmp
    },

}
</script>
